/* eslint-disable eqeqeq *///忽略==的警告
import React, { Component } from "react";
import "./brightnessarea.less";
import PubSub from 'pubsub-js'
import { meshLog, SPRemove, SPGet, SPSet } from "../../../config";
import maxtrim from '../../../static/touch/max_trim_bg.jpg'
import { lightControlJudgeAreaWorkOnSmartShift } from "../../../utils/smartshiftUtils";
import { HSLTORGB, RGBTOSixColor, } from '../../../utils/adminUtils'
import { areaLightDim } from '../../../utils/homelightUtils'
class BrightnessArea extends Component {
  componentDidMount() {
    // meshLog("每个组传进来的值1", this.props);
    let addr = this.props.element.groupId
    let item = this.props.element
    //let maxTrim = this.props.element.maxTrim//为以后做准备
    let areaSet = [];
    let eBarWrap = document.getElementById(addr);
    let groupSetx = JSON.parse(SPGet("groupSetx"));
    //修改的默认值方法
    let areaSetxxx = [];
    areaSetxxx = groupSetx && groupSetx.filter((item) => {
      const pamdun1 = item.groupId;
      if (pamdun1 === addr) {
        return item
      }
    })
    meshLog('areaSetxxx', areaSetxxx);
    //获取滑动条
    let eBarCon = eBarWrap.getElementsByClassName('areaslide')[0];
    //获取滑动痕迹元素
    let eBarInto = eBarWrap.getElementsByClassName('areacontent')[0];
    let areamix = eBarWrap.getElementsByClassName('areamix')[0];
    //获取滑块
    let eBarDrag = eBarWrap.getElementsByClassName('btnkuai')[0];
    //获取文本元素
    let areamsg = eBarWrap.getElementsByClassName('areamsg')[0];
    // let eBarText = eBarWrap.getElementsByClassName('bar_text')[0];
    //获取最大位置
    let maxTrim2 = 100 //16转换成10进制
    let max = maxTrim2 / 100
    let nMax = (eBarCon.offsetWidth - eBarDrag.offsetWidth) * max;
    let nMaxx = (eBarCon.offsetWidth - eBarDrag.offsetWidth);
    // meshLog("max", max);
    // meshLog("maxTrim2", maxTrim2);
    let chackshu1 = Math.round((maxTrim2))
    let chackshu2 = parseInt(this.props.element.groupStatus.slice(2, 4), 16)
    //meshLog('1231232', chackshu2);

    // meshLog("chackshu", chackshu1);
    // meshLog("获取的数据", chackshu2);
    areamix.style.width = (eBarCon.offsetWidth - eBarDrag.offsetWidth) * max + eBarDrag.offsetWidth + 'px';
    //判断第一次获取默认值的大小来进行是不是在最大值
    if (chackshu1 > chackshu2) {
      //修改默认数值
      let dim = Math.round(parseInt(areaSetxxx[0].groupStatus.slice(2, 4), 16))
      if (dim == 0) {
        dim = 1
      }
      areamsg.value = dim + '%';
      eBarDrag.style.left = Math.round(parseInt(areaSetxxx[0].groupStatus.slice(2, 4), 16) / 100 * nMaxx) + 'px';
      eBarInto.style.width = Math.round(parseInt(areaSetxxx[0].groupStatus.slice(2, 4), 16) / 100 * nMaxx) + eBarDrag.offsetWidth / 2 + 'px';
    } else {
      //修改默认数值 修改成最大值
      let dim = maxTrim2
      areamsg.value = dim + '%';
      eBarDrag.style.left = nMax + 'px';
      eBarInto.style.width = nMax + eBarDrag.offsetWidth / 2 + 'px';
    }
    //meshLog(eBarInto.style.width);

    //修改灯不开的时候点击问题，解决外面点击开关灯来解决问题
    let ssoo = this.props.element.isOnoff
    PubSub.unsubscribe("areadev")
    PubSub.subscribe('areadev', (msg, data) => {
      // meshLog('data', data);
      setTimeout(() => {
        PubSub.publish('areadev2', data)
      }, 500)
    })
    function guanguan() {
      meshLog('brightnessarea.js,170行,关了');
    }
    if (ssoo == '00') {
      //meshLog('关', ssoo);
      eBarDrag.removeEventListener('mousedown', guanguan, false);
      eBarCon.removeEventListener('click', guanguan, false);
    } else {
      //meshLog('可以', ssoo);
      //滑块添加拖拽事件
      eBarDrag.addEventListener('mousedown', function (event) {
        meshLog("brightnessarea.js,170行,wjk dim area-mousedown: " + addr);
        let isOccu = lightControlJudgeAreaWorkOnSmartShift(addr, true);
        if (isOccu) {
          return;
        }
        //初始化鼠标开始拖拽的点击位置
        let nInitX = event.clientX;
        //初始化滑块位置
        let nInitLeft = this.offsetLeft;
        //meshLog("初始化滑块位置", nInitLeft);
        //页面绑定鼠标移动事件
        document.onmousemove = event => {
          //鼠标移动时取消默认行为，避免选中其他元素或文字
          event.preventDefault();
          //获取鼠标移动后滑块应该移动到的位置
          let nX = event.clientX - nInitX + nInitLeft;
          //限制滑块最大移动位置
          if (nX >= nMax) {
            nX = nMax;
          }
          //限制滑块最小移动位置
          if (nX <= 0) {
            nX = 1;
          }
          //修改滑块位置（因为用的是箭头函数，所以this还是指向滑块）
          this.style.left = nX + 'px';
          //修改滑动痕迹宽度
          eBarInto.style.width = nX + this.offsetWidth / 2 + 'px';
          //修改文本数值eBarText.innerHTML = Math.ceil(nX / nMax * 100) / 10;
          areamsg.value = Math.ceil(nX / (nMaxx) * 100) + '%';
          // meshLog('实时的参数值', Math.ceil(nX / nMax * 100));
        };
        //鼠标松开绑定事件，取消页面上所有事件
        document.onmouseup = async function (event) {
          document.onmousemove = null;
          document.onmouseup = null;
          meshLog("滑动最终的值", areamsg.value);
          let dimdim = areamsg.value.slice(0, areamsg.value.length - 1)
          areaLightDim(dimdim, addr)
        }
      });
      //滑动条添加点击事件
      eBarCon.addEventListener('click', async function (event) {
        meshLog("brightnessarea.js,170行,wjk dim area-click: " + addr);
        let isOccu = lightControlJudgeAreaWorkOnSmartShift(addr, true);
        if (isOccu) {
          return;
        }
        //设置滑动条位置
        let nLeft = this.offsetLeft;
        //获取有定位的父元素
        let eParent = this.offsetParent;
        //循环所有有定位的父元素
        while (eParent) {
          //添加定位父元素offsetLeft值，用于准确定位滑动条与页面左侧的距离
          nLeft += eParent.offsetLeft;
          //再次获取父元素外的定位父元素
          eParent = eParent.offsetParent;
        }
        //计算滑块位置
        let nX = event.clientX - nLeft;
        //修改滑块位置
        if (nX >= nMax) {
          nX = nMax;
        }
        //限制滑块最小移动位置
        if (nX <= 0) {
          nX = 1;
        }
        eBarDrag.style.left = nX + 'px';
        // meshLog("clientX", event.clientX);
        //修改滑动痕迹宽度
        eBarInto.style.width = nX + eBarDrag.offsetWidth / 2 + 'px';
        //修改文本数值eBarText.innerHTML = Math.ceil(nX / nMax * 100) / 10
        areamsg.value = Math.ceil(nX / nMaxx * 100) + '%';
        let dimdim = Math.ceil(nX / nMaxx * 100);
        //meshLog("点击的最终值", areamsg.innerText)
        areaLightDim(dimdim, addr)
      }, false);
    }
  }
  areamsgCheck = (object) => {
    let addr = this.props.element.groupId
    let maxTrim = this.props.element.maxTrim
    let eBarWrap = document.getElementById(addr);
    //获取滑动条
    let eBarCon = eBarWrap.getElementsByClassName('areaslide')[0];
    //获取滑动痕迹元素
    let eBarInto = eBarWrap.getElementsByClassName('areacontent')[0];
    //获取滑块
    let eBarDrag = eBarWrap.getElementsByClassName('btnkuai')[0];
    //获取文本元素
    let areamsg = eBarWrap.getElementsByClassName('areamsg')[0];
    // let eBarText = eBarWrap.getElementsByClassName('bar_text')[0];
    //获取最大位置
    let maxTrim2 = Math.round((parseInt(maxTrim, 16)) / 65535 * 100) //16转换成10进制
    let max = maxTrim2 / 100
    let nMax = (eBarCon.offsetWidth - eBarDrag.offsetWidth) * max;
    let nMaxx = (eBarCon.offsetWidth - eBarDrag.offsetWidth);
    //修改最大值
    //meshLog('maxtemdata', maxtemdata);
    let exp = /^[+-]?\d*(\.\d*)?(e[+-]?\d+)?$/
    let a = object.target.value
    if (exp.test(a)) {
      //为一个纯数值字符串
      meshLog('brightnessarea.js,285行,为一个纯数值字符串');
      if (object.target.value >= 100) {
        object.target.value = 100
      } else {
        if (object.target.value <= 0) {
          object.target.value = ''
        } else {
          object.target.value = object.target.value
        }
      }
    } else {
      //...
      meshLog('brightnessarea.js,297行,不是一个纯数值字符串');
      object.target.value = 1
    }
  }
  checkareadim = async (object) => {
    let addr = this.props.element.groupId
    let maxTrim = this.props.element.maxTrim
    let eBarWrap = document.getElementById(addr);
    //获取滑动条
    let eBarCon = eBarWrap.getElementsByClassName('areaslide')[0];
    //获取滑动痕迹元素
    let eBarInto = eBarWrap.getElementsByClassName('areacontent')[0];
    //获取滑块
    let eBarDrag = eBarWrap.getElementsByClassName('btnkuai')[0];
    //获取文本元素
    let areamsg = eBarWrap.getElementsByClassName('areamsg')[0];
    // let eBarText = eBarWrap.getElementsByClassName('bar_text')[0];
    //获取最大位置
    let maxTrim2 = Math.round((parseInt(maxTrim, 16)) / 65535 * 100) //16转换成10进制
    let max = maxTrim2 / 100
    let nMax = (eBarCon.offsetWidth - eBarDrag.offsetWidth) * max;
    let nMaxx = (eBarCon.offsetWidth - eBarDrag.offsetWidth);
    let dim = 0
    let exp = /^[+-]?\d*(\.\d*)?(e[+-]?\d+)?$/
    let a = object.target.value
    if (exp.test(a)) {
      //为一个纯数值字符串
      if (object.target.value == '') {
        meshLog('brightnessarea.js,325行,修改数据');
        dim = 1
      } else {
        dim = object.target.value
      }
      areamsg.value = dim + '%';
    } else {
      //...
      meshLog('brightnessarea.js,333行,checkarea不变');
    }
    let nX = dim * nMaxx / 100
    eBarDrag.style.left = nX + 'px';
    //修改滑动痕迹宽度
    eBarInto.style.width = nX + eBarDrag.offsetWidth / 2 + 'px';
    //修改文本数值eBarText.innerHTML = Math.ceil(nX / nMax * 100) / 10
    //areamsg.value = Math.ceil(nX / nMaxx * 100);
    areaLightDim(dim, addr)
  }
  checkareaFocus = async (object) => {
    let addr = this.props.element.groupId
    let eBarWrap = document.getElementById(addr);
    let areamsg = eBarWrap.getElementsByClassName('areamsg')[0];
    let areaSetx = JSON.parse(SPGet("areaSetx"));
    //修改的默认值方法
    let areaSetxxx = [];
    areaSetxxx = areaSetx && areaSetx.filter((item) => {
      const pamdun1 = item.groupId;
      if (pamdun1 === addr) {
        return item
      }
    })
    if (areaSetxxx[0].isOnoff == '00') {
      areamsg.disabled = true
    } else {
      areamsg.disabled = ''
    }
    areamsg.value = object.target.value.slice(0, object.target.value.length - 1)
  }
  render() {
    return (
      <div style={{ float: "left" }}>
        <div className="area1" id={this.props.element.groupId}>
          <img className="maxtrimtu" style={{ marginTop: -10 }} src={maxtrim} />
          <input disabled={this.props.element.isOnline == '00' && this.props.element.isOnoff == '00' ? true : false}
            style={{ cursor: 'pointer', color: '#000000', marginTop: -53, backgroundColor: this.props.element.groupId == JSON.parse(SPGet("areaNopandun")) ? '#F1FAFF' : '' }}
            onFocus={this.checkareaFocus} onBlur={this.checkareadim} type="string" onInput={this.areamsgCheck} className="areamsg" ></input>
          <div className="areamix" style={{ marginTop: -23 }} >
          </div>
          <div className="areaslide" style={{ marginTop: -23 }}   >
            <div className="areacontent" >
            </div>
          </div>
          <div className="btnkuai">
          </div>
        </div>
      </div >
    );
  }
};
export default BrightnessArea;
